<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>JQurty</title>
</head>
<body>
    <!-- 元素操作 -->
    <div id="test"><span>div</span></div>
    <div id="test2"><span>div</span></div>
    <input type="text" id="userName" value="zhangsan">

    <input type="button" value="点击" id="button">

    <script src="jquery.min.js"></script>
    <script>
        // $(document).ready(function(){
        //     //选择器,可以使用id选(用 # 表示选id --> "#button"),也可能使用标签("button")
        //     //用双引号还是单引号都是可以的
        //     $("button").click(
        //         //这里表示要执行这个方法,同时是对 button(标签 --> 表明是一个按钮) 来进行
        //         function(){
        //             $(this).hide();
        //     });
        // });

        // //简写(一般不简写)
        // $("#button1").click(
        //     function(){
        //         $(this).hide();
        //     }
        // );

        //返回
        // var string = $("#test").text();//获取当前元素的值
        // console.log(string);

        // var html = $("#test").html();//会返回内部的标签
        // console.log(html);

        // var val = $("#userName").val();//获取value
        // console.log(val);


        //设置 --> 直接进行操作
        

        $(document).ready(function(){
            $("#button").click(function(){
                $("#test").text("test");//修改 此时不管控制的标签里面有什么,全部变成 要修改成的东西(包括标签)
     
                $("#test2").html("html");//

                $("#userName").val("王五");
            });
        });


    </script>
</body>
</html>